<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="edge" />
    <title>[[#{system.title}]]</title>
    <!-- add version by aaron 2018.12.17 -->
    <link rel="shortcut icon" type="image/png" th:href="@{/img/favicon.ico}" />
    <link rel="stylesheet" th:href="@{css/login.css(t=${version})}" type="text/css">
    <link rel="stylesheet" th:href="@{css/iCheck/minimal/tpv.css(t=${version})}" type="text/css">
    <link rel="stylesheet" th:href="@{css/app.css(t=${version})}" type="text/css">
    <link rel="stylesheet" th:href="@{css/tpv/login.css(t=${version})}" type="text/css">
    <!-- animate -->
    <link rel="stylesheet" th:href="@{css/animate/animate.min.css}" type="text/css">
    <script th:src="@{js/jquery.min.js}"></script>
    <script th:src="@{js/iCheck/icheck.js}"></script>
    <script th:src="@{js/tether/tether.min.js}"></script>
    <script th:src="@{js/bootstrap/bootstrap.min.js}"></script>
    <script th:src="@{js/bootstrap-notify/bootstrap-notify.min.js}"></script>
    <script th:src="@{js/jquery.i18n/jquery.i18n.properties.js}"></script>
    <script th:inline="javascript">
        var ctx = [[@{/}]];
        var LANGUAGE_CODE = [[#{language}]];
    </script>
    <script th:src="@{js/common.js(t=${version})}"></script>
</head>
<style>

</style>
<body>
    <!-- Form-->
    <div class="form tpv-login-from clearfix">
        <!-- add by aaron.wei 2019.01.22 -->
        <div class="tpv-login-info">
            <h1>TPV Cloud VC</h1>
            <p>软硬件结合的云视讯会议，让沟通更简单、</p>
            <p>更高效。</p>
        </div>
        <!-- end -->
        <div class="form-toggle"></div>
        <div class="form-panel one tpv-login-layout">
            <div class="form-header tpv-login-header clearfix">
                <div class="tpv-login-icon"><i data-toggle="modal" data-target="#about-us"></i></div>
                <ul class="clearfix tpv-login-lang">
                    <li th:class="#{language} == 'zh_CN' ? 'active' : ''"><a href="/language?language=zh_cn">简体中文</a></li>
                    <li th:class="#{language} == 'en_US' ? 'active' : ''"><a href="/language?language=en">English</a></li>
                </ul>
            </div>
            <div class="tpv-login-logo">
                <img data-th-src="@{img/tpv/login/login_tpv_logo.png}" />
            </div>
            <div class="form-content tpv-login-content">
                <div class="input-group tpv-input-name">
                    <i></i>
                    <input type="text" class="form-control tpv-form-input" name="username" th:placeholder="#{login.user.name}">
                </div>
                <div class="input-group tpv-input-pwd">
                    <i></i>
                    <input type="password" class="form-control tpv-form-input" name="password" th:placeholder="#{login.password}" />
                </div>
                <div class="input-group">
                    <input type="text" name="code" class="form-control tpv-form-input" th:placeholder="#{login.verification.code}" autocomplete="off" style="width:40%; padding: 12px;" />
                    <img  id="validateCodeImg" onclick="reloadCode()" style="display:inline-block" />
                </div>
                <div class="form-group tpv-login-check">
                    <p><label for="rememberme"><input type="checkbox" name="rememberme" /><span class="tpv-check-tips">[[#{login.remember.me}]]</span></label></p>
                    <p><label for="autologin"><input type="checkbox" name="autologin" /><span class="tpv-check-tips">[[#{login.auto.btn}]]</span></label></p>
                </div>
                <div class="form-group tpv-login-btn">
                    <button onclick="login()" id="loginButton">[[#{login.btn}]]</button>
                </div>
            </div>
            <div class="tpv-footer-layout">
                <p><a href="/meeting/join">[[#{login.meeting.btn}]]</a></p>
            </div>
        </div>
        <!-- <div class="form-panel two">
            <div class="form-header">
                <h1>账户注册</h1>
            </div>
            <div class="form-content">
                <div class="form-group">
                    <label>用户名</label>
                    <input type="text" name="username" />
                </div>
                <div class="form-group">
                    <label>密码</label>
                    <input type="password" name="password" />
                </div>
                <div class="form-group">
                    <label>确认密码</label>
                    <input type="password" name="cpassword" />
                </div>
                <div class="form-group">
                    <button onclick="regist()">注册</button>
                </div>
            </div>
        </div> -->
    </div>
    <div class="tpv-common-footer-layout" data-th-include="common/footer"></div>
    <div class="modal fade" id="about-us" data-keyboard="false" data-backdrop="static" tabindex="-1" aria-hidden="true">
        <div class="modal-dialog modal-lg tpv-login-modal-layout">
            <div class="modal-content">
                <div class="modal-header tpv-login-about-header">
                    <h3 class="modal-title pull-left">[[#{login.about}]]</h3>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body tpv-login-about-body">
                    <div class="tpv-modal-logo"><img th:src="@{img/tpv/login/about_tpv_logo.png}" /></div>
                    <p class="tpv-version">[[#{login.version}]]: [[${version}]]</p>
                    <p class="tpv-copyright">Copyright&copy;2018 [[#{login.company}]], All right reserved.</p>
                </div>
                <div class="modal-footer tpv-login-about-footer">
                    <button type="button" class="btn tpv-btn-update">[[#{login.update.btn}]]</button>
                    <button type="button" data-dismiss="modal" class="btn btn-secondary tpv-btn-close">[[#{login.cancle.btn}]]</button>
                </div>
            </div>
        </div>
    </div>
</body>
<script th:src="@{js/app/login.js(t=${version})}"></script>
</html>
